<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="com.yaodian100.core.common.utils.ServerValue"%>    
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@taglib prefix="pu" uri="/WEB-INF/tld/pageutil.tld" %>
<%@taglib prefix="mu" uri="/WEB-INF/tld/mallutil.tld" %>
<%@taglib uri="http://java.sun.com/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jstl/core_rt" prefix="c-rt"%>
<%@taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt-rt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@taglib uri="/WEB-INF/tld/importTag.tld" prefix="import" %>
<style> 
.promo-popup{padding:10px;*padding:10px 0 10px 8px; color:#666;line-height:1.4em; }
.promo-popup h2,.promo-popup h3{font-size:15px;color:#d12e6f; margin-bottom:.8em;}
.promo-popup h3{color:#666;}
.promo-popup p{margin:.5em 0;}
.promo-popup .d-line{background:url(/images/link_dote.gif) repeat-x scroll 0 50%; padding:1px 0;}
.promo-popup ol,.promo-popup ul{margin-bottom:1em;margin-left:2em;}
.promo-popup li{list-style:decimal;}
</style>
<script src="/js/pageable.js"></script>
${pu:reqSet('order', pu:get('com.yaodian100.ec.order.entity.Orders', param.orderId)) }
<script>
$(function(){ 
	$('#current_location').html(' > 变更收货人信息');
}); 
</script>
<c-rt:if test="${order.memberId==mu:memberId()}">
<script>
$().ready(function(){
	$("#contactNameTip").hide();
	$("#mobileTip").hide();
	$("#phoneTip").hide();
	$("#showAddress").hide();
	$("#canModifyMessage").hide();
	$("#addressTip").hide();
	$("#showCODmessage").dialog({
		bgiframe: true,
		autoOpen: false,
		height: 200,
		width:400,
		modal: true
	});	
	$("#showPOSmessage").dialog({
		bgiframe: true,
		autoOpen: false,
		height: 200,
		width:400,
		modal: true
	});	

//address start

		$("#province").children().each(function(index){
			if (trim($(this).text()) == trim('${order.receiverProvince}')){
				$("#province")[0].selectedIndex = index ;
				queryProvince2('${order.receiverCity}','${order.receiverArea}');
			}
		});

		$("#province").change(function() {
			var optionsCity = '<option value="">== 选择城市 ==</option>';
			$("#city").html(optionsCity);
			var options = '<option value="">== 选择地区 ==</option>';
			$("#district").html(options);
			$("#displayPOS").hide();
			queryProvince2('','');
	   });	

		$("#city").change(function() {
			queryCity2('');
	    });	

		$("#district").change(function() {
			queryDistinct();
			//判断是否可货到付款
			var tmpCity=$("#city").find('option:selected').val();
			var tmpDistrict=$("#district").find('option:selected').text();
			var districtVal = $("#district").find('option:selected').val();
			var dtVal=districtVal.split(",");
				if(tmpDistrict.substring(0,1)=='※'){
					$("#paytype30").attr("disabled",false); 
					$("#paytypeCash").attr("disabled",false);
					$("#paytypePos").attr("disabled",false); 
					$("#showOrderPriceLimit").html("(需加收手续费 ${codFee} 元)");
				}else{
					$("#paytype30").attr("disabled",true); 
					$("#paytype30").attr("checked",false); 
					$("#paytypeCash").attr("disabled",true); 
					$("#paytypeCash").attr("checked",false);
					$("#paytypePos").attr("disabled",true); 
					$("#paytypePos").attr("checked",false);
					$("#showOrderPriceLimit").html("(需加收手续费 ${codFee} 元)");
				}	
				$("#version").val(dtVal[2]);
			isPos();
		 });   


	//去除字串左邊的空白虛格
		function ltrim(instr){
		return instr.replace(/^[\s]*/gi,"");
		}

		//去除字串右邊的空白虛格
		function rtrim(instr){
		return instr.replace(/[\s]*$/gi,"");
		}

		//去除字串前後的空白虛格
		function trim(instr){
		instr = ltrim(instr);
		instr = rtrim(instr);
		return instr;
		}

		
		//查詢province ajax
		function queryProvince2(adCity,adDistrict){
			var province=$("#province").find('option:selected').val();
			$.post("<%=ServerValue.getFrontContextPath()%>/shopping/addressdata/findOrderCitys.do",{id:'${order.orderId}',province:province},callback,"json");
			function callback(actionResult){
				addressObj(actionResult,'CITY',adCity,adDistrict);
			}
		}
		
		//查詢city ajax
		function queryCity2(adDistrict){
			var city=$("#city").find('option:selected').val();
			$.post("<%=ServerValue.getFrontContextPath()%>/shopping/addressdata/findOrderDistrictsCod.do",{id:'${order.orderId}',city:city},callback,"json");
			function callback(actionResult){
				addressObj(actionResult,'DISTRICT','',adDistrict);
				showAddressFun();
			}
		}

		//Province&City 查詢元件
		function addressObj(actionResult,execObj,adCity,adDistrict){
			if(actionResult!=null ){
						var arr_text = actionResult.split("$");		
						if(execObj=='CITY'){								
							var options = '<option value="">== 选择城市 ==</option>';
						}
						if(execObj=='DISTRICT'){
							var options = '<option value="">== 选择地区 ==</option>';
						}
						 for(i=0;i<arr_text.length;i++)
						 {
							 v=arr_text[i].split(",");
							 if(execObj=='CITY'){	
								options += '<option value="' + v[1] + '">' + v[1] + '</option>';
							 }
							if(execObj=='DISTRICT'){
								options += '<option value="' + v[1]+','+v[2]+','+v[3] + '">' + v[1] + '</option>';
							}
						 }
						 var aObj;
						 if(execObj=='CITY'){	
							 $("#city").html(options);
							 aObj=$("#city");
						 }
						 if(execObj=='DISTRICT'){
							 $("#district").html(options);
							 aObj=$("#district");
						 }
							 aObj[0].selectedIndex = 0 ; 
							var tmpObj;
							if(execObj=='CITY'){	
								tmpObj=adCity;
							 }
							 if(execObj=='DISTRICT'){
								 tmpObj=adDistrict;
							 }
							 if(tmpObj !=""){
								 aObj.children().each(function(index){
									 if(execObj=='CITY'){	
										 if ($(this).text()==adCity){
										       setTimeout(function() {  aObj[0].selectedIndex = index ; 
										       queryCity2(adDistrict);} , 1);
										    }
										 }
										 if(execObj=='DISTRICT'){
											 if ($(this).text().substring(1)==adDistrict || $(this).text()==adDistrict){
											    	setTimeout(function() {  $("#district")[0].selectedIndex = index ;
											    	queryDistinct();},1);
											    }
										 }
								 });
							 }
			}
		}


		//修改收货人信息－无法用货到付款方式送达新地址的提示讯息
		function checkIfCodPos(){
			var districtVal = $("#district").find('option:selected').val();
			var dtVal=districtVal.split(",");
			if((${order.paymentTp} == '30' || ${order.paymentTp} == '60') && ${order.orderSt} =='00'){
				if(dtVal[0].substring(0,1)=='※'){
					if(dtVal[1]=='N' && '${order.paymentTp}' == '60'){
						$("#showPOSmessage").dialog('open');
						return false;
						}else{
						return true;
						}
				}else{
					$("#showCODmessage").dialog('open');
				return false;
				}
			  }else {
				  return true;
			  }
		}		

		//查詢distinct ajax
		function queryDistinct(){
			var districtVal = $("#district").find('option:selected').val();
			var districtTxt = $("#district").find('option:selected').text();
			var dtVal=districtVal.split(",");
			//if(districtTxt.substring(0,1)=='※' && dtVal[2]!='' && dtVal[3]!=''){
					//alert('可服務區域：'+dtVal[2]+',不可服務區域：'+dtVal[3]);
			//}
			if(districtTxt.substring(0,1)=='※'){
				//startDistrict=startDistrict.substring(1);
				if(parseFloat($("#finalTotalAmount").val())>10000){
					$("#paytype30").attr("disabled",true);
					$("#paytypeCash").attr("disabled",true);
					$("#paytypePos").attr("disabled",true); 
					$("#showOrderPriceLimit").html("(订单金额超过10000元，将不提供货到付款服务。)");
					$("#displayPOS").hide();
				}else{
					$("#paytype30").attr("disabled",false); 
					$("#paytypeCash").attr("disabled",false);
					$("#paytypePos").attr("disabled",false); 
					$("#displayPOS").show();
				}
			}
			isPos();
			showAddressFun();
		}
		//判斷是否使用POS
		function isPos(){
			var tmpDistrictVal=$("#district").find('option:selected').val();
			var dtVal=tmpDistrictVal.split(",");
			if(dtVal[1]=='N'){
				$("#paytypePos").attr("disabled",true); 
				$("#posMessage").html("<span class='txt-rd'><%=ServerValue.getOrderModiyAddress()%></span>");
			}else{
				$("#posMessage").html("");
			}	
		}

//address end

		$("#sub_ok").click(function(){
			$("#showCODmessage").dialog('close');
		});
		$("#sub_ok_pos").click(function(){
			$("#showPOSmessage").dialog('close');
		});
		
 		showAddressFun();

		function showAddressFun(){
			 <c-rt:choose>
				 <c-rt:when test="${order.myWallet > 0 or order.giftcardBalance > 0}">
				 	$("#canModifyMessage").show();
				  $("#showAddress").hide();
				 </c-rt:when>
				 <c-rt:otherwise>
				 if((${order.paymentTp} == '30' || ${order.paymentTp} == '60') && ${order.orderSt} =='00'){
						$("#showAddress").show();
						$("#canModifyMessage").hide();
				  }else if((${order.paymentTp} == '50'|| ${order.paymentTp} == '70'||${order.paymentTp} == '80')&& ${order.orderSt} =='10'){
						$("#showAddress").show();
						$("#canModifyMessage").hide();
				  }else{
					  $("#canModifyMessage").show();
					  $("#showAddress").hide();
				  }
				 </c-rt:otherwise>
			 </c-rt:choose>
		}

		//从收货地址簿选取
		$("#myAddBook").click(function(){
			openDialog("从收货地址簿选取",$("#myAddBookDialog").load("<%=ServerValue.getFrontContextPath()%>/member/orderMod/loadMyAddBook.do?orderId=${order.orderId}"),700,'auto');			
		});
	
	$("#go_next").click(function() {
		$("#contactNameTip").hide();
		$("#mobileTip").hide();
		$("#phoneTip").hide();
		$("#addressTip").hide();
		if($("#contactName").val()==""){
			$("#contactNameTip").show();
			return false;
		}	
		if($("#mobile").val()=="" && $("#areaCode").val()==" " && $("#phone").val()==" " && $("#extension").val()==" "){
			$("#phoneTip").show();
			$("#mobileTip").show();
			return false;
		}	
		if($("#mobile").val()==""){
			$("#mobileTip").show();
			return false;
		}

		<c-rt:choose>
		<c-rt:when test="${(order.paymentTp == '50' || order.paymentTp == '70' || order.paymentTp == '80' ) && order.orderSt =='10'}">	
		 if(isNaN(parseInt($("#zipCode").val(), 10))==true && $("#zipCode").val() !=""){
				$("#addressTip").html("<br /> <span style='margin-left:4.3em;*margin-left:4.8em; '  class='msg rn'>邮编错误</span>");
				$("#addressTip").show();
				$("#zipCode").focus();
				return false;
			}	
		 if( $("#zipCode").val() ==""){
				$("#addressTip").html("<br /> <span style='margin-left:4.3em;*margin-left:4.8em; '  class='msg rn'>请输入邮编</span>");
				$("#addressTip").show();
				$("#zipCode").focus();
				return false;
			}
			if($("#province").find('option:selected').text()=="== 选择省 =="){
				$("#addressTip").show();
				return false;
			}		
			if($("#city").find('option:selected').text()=="== 选择城市 =="){
				$("#addressTip").show();
				return false;
			}
			if($("#district").find('option:selected').text()=="== 选择地区 =="){
				$("#addressTip").show();
				return false;
			}
			if($("#addr").val()==""){
				$("#addressTip").show();
				return false;
			}
			if(checkIfCodPos()== false){
				return false;
			}
		</c-rt:when>
		 <c-rt:when test="${(order.paymentTp == '30' || order.paymentTp == '60') && order.orderSt =='00'}">
		 if(isNaN(parseInt($("#zipCode").val(), 10))==true && $("#zipCode").val() !=""){
				$("#addressTip").html("<br /> <span style='margin-left:4.3em;*margin-left:4.8em; '  class='msg rn'>邮编错误</span>");
				$("#addressTip").show();
				$("#zipCode").focus();
				return false;
			}	

			if($("#province").find('option:selected').text()=="== 选择省 =="){
				$("#addressTip").show();
				return false;
			}		
			if($("#city").find('option:selected').text()=="== 选择城市 =="){
				$("#addressTip").show();
				return false;
			}
			if($("#district").find('option:selected').text()=="== 选择地区 =="){
				$("#addressTip").show();
				return false;
			}
			if($("#addr").val()==""){
				$("#addressTip").show();
				return false;
			}
		 	if(checkIfCodPos()== false){
				return false;
			}
		 </c-rt:when>
		 </c-rt:choose>
		$("#modAddresForm").submit();
		return false;
	});
});
</script>

<s:form action="orderMod/modAddresExe.do" id="modAddresForm" name="modAddresForm" method="post">
<input type="hidden" name="orderId" value="${order.orderId}"/>
  <!-- content start -->
  <div class="content order-modify">
    <!-- 我的訂單 -->
    <h2>变更收货人信息</h2>
    <div class="d-show">
      <p><strong>当前的收货人信息：</strong></p>
      <ul>
        <li class="w-1of1"><strong>姓 名：</strong>${order.receiverName}</li>
        <li class="w-1of1"><strong>手机号码：</strong>${order.receiverMobile}</li>
        <li class="w-1of1"><strong>固定电话：</strong>${order.receiverPhoneArea}-${order.receiverPhone}-${order.receiverExt} </li>
        <li class="w-1of1">
          <div><strong>地 址：</strong></div>
          <div>${order.receiverProvince}，${order.receiverCity}，${order.receiverArea}，${order.receiverAddr}，${order.receiverZip}
         	<span id="canModifyMessage">
           		<span class="txt-rd">(不可修改)</span>
           </span>
          </div>
        </li>
      </ul>
      <p class="c-f" style="border-bottom:1px solid #ccc; height:10px; margin:15px 0;">&nbsp;</p>
      <p><strong>变更收货人信息：</strong><a href="#" id="myAddBook">从收货地址簿选取</a></p>
      <div class="consignee" id="cssFlag">
        <ul>
          <li class="w-1of1">
            <label for="name"><span class="txt-rd">*</span> <strong>姓    名：</strong></label>
            <span>
             <input type="text"  name="contactName" id="contactName" value="${order.receiverName}" maxlength="20" size="16"/>
          </span> <br /><span id="contactNameTip" class="msg rn" style="margin-left:4.3em;*margin-left:4.8em; _margin-left:2.5em; ">请填写姓名</span>  
          </li>
                    
          	<span id="showAddress"> 
          		<c-rt:choose>
		          	 <c-rt:when test="${(order.paymentTp == '30' || order.paymentTp == '60') && order.orderSt =='00'}">
						           <li class="w-1of1">
						            <div>
						              <label><span class="txt-rd">*</span> <strong>地    址：</strong></label>
						            </div>
						            <div>省份：
									             <select id="province" name="province" class="c-prov">
									               <option value="">== 选择省 ==</option>
																	<c-rt:forEach items="${provincesMap}" var="province" >
																		<option value="${province.key}">${province.key}</option>
																	</c-rt:forEach>
									              </select>
									              	市：
													<select id="city" name="city">
														<option value="">== 选择城市 ==</option>
													</select> 区：
													<select id="district" name="district">
														<option value="">== 选择地区 ==</option>
													</select>
									              
									              <p class="txt-gy">* 号代表支持货到付款之区域，具体服务范围以物流公司可实际到达范围为准。</p>
									              邮编：
									    <input size="6"  maxlength="6" id="zipCode" name="zipCode"  value="${order.receiverZip}" />
									              街道：
									             <input id="addr" name="addr" size="50" value="${order.receiverAddr}" />
									       <span id="addressTip"> <br /> <span style="margin-left:4.3em;*margin-left:4.8em; "  class="msg rn">请输入完整的联络地址</span></span> 
									        
									            <br /><span class="txt-rd">提示：变更收货地址，将可能因运费变动而造成此笔订单金额相应变更。</span>
						            </div>
						            </li>
				        </c-rt:when>
				        <c-rt:when test="${(order.paymentTp == '50' || order.paymentTp == '70' || order.paymentTp == '80' ) && order.orderSt =='10'}">

						           <li class="w-1of1">
						            <div>
						              <label><span class="txt-rd">*</span> <strong>地    址：</strong></label>
						            </div>
						            <div>省份：
						              <select id="province" name="province" class="c-prov">
						               <option value="">== 选择省 ==</option>
														<c-rt:forEach items="${provincesMap}" var="province" >
															<option value="${province.key}">${province.key}</option>
														</c-rt:forEach>
						              </select>
									              	市：
													<select id="city" name="city">
														<option value="">== 选择城市 ==</option>
													</select> 区：
													<select id="district" name="district">
														<option value="">== 选择地区 ==</option>
													</select>
									              
									              <p class="txt-gy">※号代表货到付款支持区域，具体服务范围以物流公司可实际到达范围为准。</p>
									              邮编：
									    <input size="6"  maxlength="6" id="zipCode" name="zipCode"  value="${order.receiverZip}" />
									              街道：
									             <input id="addr" name="addr" size="50" value="${order.receiverAddr}" />
									       <span id="addressTip"> <br /> <span style="margin-left:4.3em;*margin-left:4.8em; "  class="msg rn">请输入完整的联络地址</span></span> 
									        
									            <br /><span class="txt-rd">提示：变更收货地址，将可能因运费变动而造成此笔订单金额相应变更。</span>
						            </div>
						            </li>
				        </c-rt:when>
				       <c-rt:otherwise>
				          
				       </c-rt:otherwise>
		          	</c-rt:choose>
		    </span>
          <li class="w-1of1" style="padding-left:.8em">
            <label for="tel"><strong>&nbsp;&nbsp; 固定电话：</strong></label>
            <span>
              <input type="text" name="areaCode" id="areaCode" value="${order.receiverPhoneArea}" size="4" maxlength="4"/>-
              <input type="text" name="phone" id="phone" value="${order.receiverPhone}" size="10" maxlength="10" maxlength="8"/>-分机
              <input type="text" name="extension" id="extension" value="${order.receiverExt}" size="4" maxlength="4"/>
            </span>
          <span class="txt-rd">*</span> <strong>手机号码：</strong>
           <input type="text" name="mobile" id="mobile"  value="${order.receiverMobile}" size="11" maxlength="11"/>
           <span class="txt-ss">&nbsp;(<span class="txt-rd">*</span>固定电话与手机需至少填写一区)</span> 
              <br /><span id="phoneTip" class="msg rn" style="margin-left:5.6em;*margin-left:5.9em; ">请填写固定号码</span>
              <span id="mobileTip" class="msg rn" style="margin-left:18.3em;">请填写手机号码</span>
             <br />
          </li>
          
          
        </ul>
        <p class="c-f" align="center"><br />    
           <a id="go_next"  href="javascript:;" class="btn-mid">继续</a> 
 		<a href="<%=ServerValue.getFrontContextPath()%>/member/order/page.do?page=detail&orderId=${order.orderId}" class="btn-mid">回订单页</a>
 		</p>
        </div>
      </div>
      <!-- 我的訂單 -->
    </div>
    <input type="hidden" name="version" id="version" value=""/>
     </s:form>
</c-rt:if>
<c-rt:if test="${order.memberId!=mu:memberId()}">
您无权查看本订单
</c-rt:if>
<DIV id="showCODmessage" title="请重新选择" class="alert-caution" style="display: none;">
         <p>我们无法使用货到付款方式发货到您所选择的新地址<br />
				请重新选择收货地址 或 选择另外一种支付方式。<br />
				（<a href='http://www.yaodian100.com/help/5_pay_arrival.html' target='blank'>详情请见货到付款区域说明</a>）</p>
         <div align="center"> <a href="javascript:;" class="btn-mid" id="sub_ok">确定</a></div>

</DIV>
<DIV id="showPOSmessage" title="请重新选择" class="alert-caution" style="display: none;">
         <p>您所选择的新地址不支援货到付款 - POS机刷卡，<br />
			请重新选择收货地址 或 变更另外一种支付方式。</p>
         <div align="center"> <a href="javascript:;" class="btn-mid" id="sub_ok_pos">确定</a></div>

</DIV>
<div id="myAddBookDialog"></div> 
<DIV id="dialog"></div>